<template>
  <div
    class=""
    :style="{
      height: '100%',
      backgroundColor: '#042037dd',
      '--imgw': getscalepx(1),
      '--imgh': getscalepx(3),
      '--imgr': getscalepx(-13),
      '--imgt': getscalepx(-5),
      '--imgp': getscalepx(5),
    }"
  >
    <commondatatable
      :header="header"
      :datalist="datalist"
      :coltype="coltype"
      :nametype="nametype"
      :dtscrolle="dtscrolle"
      :contentfont="getscalepx(15)"
    />
  </div>
</template>
<script>
import commonmixins from "@/mixins/bigScreen/commonmixins";
import axios from "@/utils/requestdp";
import qs from "qs";

export default {
  name: "commondatatablereyuan",
  mixins: [commonmixins],
  components: {},
  data() {
    return {
      header: [],
      datalist: [],
      hpObjArr: [],
      coltype: "",
      nametype: "center",
      dtscrolle: 0,
    };
  },
  computed: {},
  mounted() {
    //header------------------------------------------------------
    this.coltype = this.componentDetail.coltype
      ? this.componentDetail.coltype
      : "";
    this.nametype = this.componentDetail.nametype
      ? this.componentDetail.nametype
      : "center";
    this.dtscrolle = this.componentDetail.dtscrolle
      ? this.componentDetail.dtscrolle
      : 0;
    let unitcolor = "#56C5FA";
    this.header = [
      {
        name: `<div style='background-image: url("/configuration/2d/reyuan.png");width: fit-content;background-size: 100% 100%;background-position: center;background-repeat: no-repeat;padding: 5px;'>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</div>`,
        flex: 23,
      },
      {
        name: `供温<br/><span style="color: ${unitcolor};">(℃)</span>`,
        flex: 10,
      },
      {
        name: `回温<br/><span style="color: ${unitcolor};">(℃)</span>`,
        flex: 10,
      },
      {
        name: `供压<br/><span style="color: ${unitcolor};">(MPa)</span>`,
        flex: 10,
      },
      {
        name: `回压<br/><span style="color: ${unitcolor};">(MPa)</span>`,
        flex: 10,
      },
      {
        name: `流量<br/><span style="color: ${unitcolor};">(t/h)</span>`,
        flex: 10,
      },
      {
        name: `热量<br/><span style="color: ${unitcolor};">(MW)</span>`,
        flex: 10,
      },
    ];
    this.header = this.header.map((item) => {
      item.name = "<div>" + item.name + "</div>";
      return item;
    });
    this.loadData2();
    this.interval = setInterval(() => {
      this.loadData2();
    }, this.$root.setting.data.interval);
  },
  methods: {
    loadData2() {
      let aaa = [];
      this.nameListHeat = [];
      this.nameListStation = [];
      this.pids = [];
      this.pidsHeat = [];
      this.pidsStation = [];
      axios.get("/bigScreen/bigScreen").then((res) => {
        let data = res.data
          .filter((v) => v.attrName === "heatplant_pids")[0]
          .attrValue.split(",");
        data.forEach((v) => {
          this.pids.push(Number(v.split("@@")[1]));
          if (v.split("@@")[0] === "heatplant") {
            this.pidsHeat.push(Number(v.split("@@")[1]));
            this.nameListHeat.push({
              pid: Number(v.split("@@")[1]),
              name: `<span style="color:#F0BF7B;">${v.split("@@")[2]}</span>`,
            });
          } else if (v.split("@@")[0] === "station") {
            this.pidsStation.push(Number(v.split("@@")[1]));
            this.nameListStation.push({
              pid: Number(v.split("@@")[1]),
              name: `<span style="color:#F0BF7B;">${v.split("@@")[2]}</span>`,
            });
          }
        });
        let params = {
          pageNum: 1,
          pageSize: 30,
          pids: this.pidsHeat.join(","),
        };
        // 关联告警
        this.warnList = [];
        axios
          .post("/warn/msg/list?pageNum=1&pageSize=3000", {
            objType: "001", // 热源告警
          })
          .then((rs) => {
            let warnList = rs.rows;
            this.warnList = warnList.filter(
              (w) => this.pidsHeat.indexOf(w.pid) > -1
            );
            // 查询热源监控
            axios
              .get("/model/heatplantRealtimeMonitor?" + qs.stringify(params))
              .then((res) => {
                this.tableData = res.rows;
                this.nameListHeat.forEach((v, i) => {
                  this.tableData.forEach((v2) => {
                    if (v.pid === v2.pid) {
                      // this.nameListHeat[i]['daily_heat'] = this.formatVal(v2['daily_heat']);
                      this.nameListHeat[i]["m001t"] = this.formatVal(
                        v2["m001t"]
                      );
                      this.nameListHeat[i]["m002t"] = this.formatVal(
                        v2["m002t"]
                      );
                      this.nameListHeat[i]["m001p"] = this.formatVal(
                        v2["m001p"]
                      );
                      this.nameListHeat[i]["m002p"] = this.formatVal(
                        v2["m002p"]
                      );
                      this.nameListHeat[i]["m001q"] = this.formatVal(
                        v2["m001q"]
                      );
                      this.nameListHeat[i]["m003qc"] = this.formatVal(
                        v2["m003qc"]
                      );
                      this.nameListHeat[i][
                        "name"
                      ] = `<span style="color:#F0BF7B;">${v2["name"]}</span>`;
                    }
                  });
                  if (!("m001t" in this.nameListHeat[i])) {
                    // this.nameListHeat[i]['daily_heat'] = `<span class="default_zzn">--</span>`;
                    this.nameListHeat[i][
                      "m003qc"
                    ] = `<span class="default_zzn">--</span>`;
                    this.nameListHeat[i][
                      "m001q"
                    ] = `<span class="default_zzn">--</span>`;
                    this.nameListHeat[i][
                      "m001p"
                    ] = `<span class="default_zzn">--</span>`;
                    this.nameListHeat[i][
                      "m002p"
                    ] = `<span class="default_zzn">--</span>`;
                    this.nameListHeat[i][
                      "m001t"
                    ] = `<span class="default_zzn">--</span>`;
                    this.nameListHeat[i][
                      "m002t"
                    ] = `<span class="default_zzn">--</span>`;
                  }
                });
                this.nameListHeat.forEach((v, i) => {
                  this.warnList.forEach((v2) => {
                    if (v.pid == v2.pid) {
                      let code = v2.code;
                      let codeList = code.split("-");
                      if (codeList[4] == "003") {
                        let m001q = this.delSpan(this.nameListHeat[i]["m001q"]);
                        if (m001q !== "--") {
                          this.nameListHeat[i]["m001q"] = this.formatVal(
                            m001q,
                            String(v2.bound)
                          );
                        }
                      } else if (codeList[4] == "004") {
                        let m001t = this.delSpan(this.nameListHeat[i]["m001t"]);
                        if (m001t !== "--") {
                          this.nameListHeat[i]["m001t"] = this.formatVal(
                            m001t,
                            String(v2.bound)
                          );
                        }
                      } else if (codeList[4] == "005") {
                        let m002t = this.delSpan(this.nameListHeat[i]["m002t"]);
                        if (m002t !== "--") {
                          this.nameListHeat[i]["m002t"] = this.formatVal(
                            m002t,
                            String(v2.bound)
                          );
                        }
                      } else if (codeList[4] == "006") {
                        let m001p = this.delSpan(this.nameListHeat[i]["m001p"]);
                        if (m001p !== "--") {
                          this.nameListHeat[i]["m001p"] = this.formatVal(
                            m001p,
                            String(v2.bound)
                          );
                        }
                      } else if (codeList[4] == "007") {
                        let m002p = this.delSpan(this.nameListHeat[i]["m002p"]);
                        if (m002p !== "--") {
                          this.nameListHeat[i]["m002p"] = this.formatVal(
                            m002p,
                            String(v2.bound)
                          );
                        }
                      }
                    }
                  });
                });
                aaa = this.nameListHeat.map((v) => Object.values(v));
                // 关联告警
                this.warnListStation = [];
                let bbb = [];
                axios
                  .post("/warn/msg/list?pageNum=1&pageSize=3000", {
                    objType: "007", // 热力站告警
                  })
                  .then((rs) => {
                    let warnListStation = rs.rows;
                    this.warnListStation = warnListStation.filter(
                      (w) => this.pidsStation.indexOf(w.pid) > -1
                    );
                    // 查询热力站数据
                    let formdata = new FormData();
                    if (this.pidsStation.length) {
                      formdata.append(
                        "search",
                        `&pid in (${this.pidsStation.join(",")})`
                      );
                    }
                    // 查询热源监控
                    axios
                      .post(
                        "/model/substationMonitor?&pageSize=300&pageNum=1",
                        formdata
                      )
                      .then((res) => {
                        let tableData2 = res.data;

                        let uniterr = [
                          "南环隔压站（零次）",
                          "百荣隔压站（零次）",
                          "高新隔压站（零次）",
                        ];

                        tableData2.map((row) => {
                          if (uniterr.indexOf(row.name) != -1) {
                            row["m_003qc"] = (row["m_003qc"] / 1000).toFixed(0);
                          }
                        });

                        this.nameListStation.forEach((v, i) => {
                          tableData2.forEach((v2) => {
                            if (v.pid == v2.pid) {
                              // this.nameListStation[i]['jihua'] = this.formatVal(v2['jihua']);
                              this.nameListStation[i][
                                "m_001t"
                              ] = this.formatVal(v2["m_001t"]);
                              this.nameListStation[i][
                                "m_002t"
                              ] = this.formatVal(v2["m_002t"]);
                              this.nameListStation[i][
                                "m_001p"
                              ] = this.formatVal(v2["m_001p"]);
                              this.nameListStation[i][
                                "m_002p"
                              ] = this.formatVal(v2["m_002p"]);
                              this.nameListStation[i][
                                "m_003q"
                              ] = this.formatVal(v2["m_003q"]);
                              this.nameListStation[i][
                                "m_003qc"
                              ] = this.formatVal(v2["m_003qc"]);
                              this.nameListStation[i][
                                "name"
                              ] = `<span style="color:#F0BF7B;">${v2["name"]}</span>`;
                            }
                          });
                          if (!("m_001p" in this.nameListStation[i])) {
                            // this.nameListStation[i]['jihua'] = `<span class="default_zzn">--</span>`;
                            this.nameListStation[i][
                              "m_003qc"
                            ] = `<span class="default_zzn">--</span>`;
                            this.nameListStation[i][
                              "m_003q"
                            ] = `<span class="default_zzn">--</span>`;
                            this.nameListStation[i][
                              "m_001p"
                            ] = `<span class="default_zzn">--</span>`;
                            this.nameListStation[i][
                              "m_002p"
                            ] = `<span class="default_zzn">--</span>`;
                            this.nameListStation[i][
                              "m_001t"
                            ] = `<span class="default_zzn">--</span>`;
                            this.nameListStation[i][
                              "m_002t"
                            ] = `<span class="default_zzn">--</span>`;
                          }
                        });
                        this.nameListStation.forEach((v, i) => {
                          this.warnListStation.forEach((v2) => {
                            if (v.pid == v2.pid) {
                              let code = v2.code;
                              if (code === "003-002-001-001-000-0131") {
                                this.nameListStation[i][
                                  "name"
                                ] = `<span class="red" style="color:#F0BF7B;">${this.nameListStation[i]["name"]}</span>`;
                                let jihua = this.delSpan(
                                  this.nameListStation[i]["jihua"]
                                );
                                this.nameListStation[i][
                                  "jihua"
                                ] = `<span class="red">${jihua}</span>`;
                                let m_003qc = this.delSpan(
                                  this.nameListStation[i]["m_001t"]
                                );
                                this.nameListStation[i][
                                  "m_003qc"
                                ] = `<span class="red">${m_003qc}</span>`;
                                let m_003q = this.delSpan(
                                  this.nameListStation[i]["m_001t"]
                                );
                                this.nameListStation[i][
                                  "m_003q"
                                ] = `<span class="red">${m_003q}</span>`;
                                let m001t = this.delSpan(
                                  this.nameListStation[i]["m_001t"]
                                );
                                this.nameListStation[i][
                                  "m_001t"
                                ] = `<span class="red">${m001t}</span>`;
                                let m002t = this.delSpan(
                                  this.nameListStation[i]["m_002t"]
                                );
                                this.nameListStation[i][
                                  "m_002t"
                                ] = `<span class="red">${m002t}</span>`;
                                let m001p = this.delSpan(
                                  this.nameListStation[i]["m_001p"]
                                );
                                this.nameListStation[i][
                                  "m_001p"
                                ] = `<span class="red">${m001p}</span>`;
                                let m002p = this.delSpan(
                                  this.nameListStation[i]["m_002p"]
                                );
                                this.nameListStation[i][
                                  "m_002p"
                                ] = `<span class="red">${m002p}</span>`;
                              } else {
                                let codeList = code.split("-");
                                if (codeList[4] == "004") {
                                  // 供水温度
                                  let m001t = this.delSpan(
                                    this.nameListStation[i]["m_001t"]
                                  );
                                  if (m001t !== "--") {
                                    this.nameListStation[i][
                                      "m_001t"
                                    ] = this.formatVal(m001t, String(v2.bound));
                                  }
                                } else if (codeList[4] == "005") {
                                  // 回水温度
                                  let m002t = this.delSpan(
                                    this.nameListStation[i]["m_002t"]
                                  );
                                  if (m002t !== "--") {
                                    this.nameListStation[i][
                                      "m_002t"
                                    ] = this.formatVal(m002t, String(v2.bound));
                                  }
                                } else if (codeList[4] == "006") {
                                  // 供水压力
                                  let m001p = this.delSpan(
                                    this.nameListStation[i]["m_001p"]
                                  );
                                  if (m001p !== "--") {
                                    this.nameListStation[i][
                                      "m_001p"
                                    ] = this.formatVal(m001p, String(v2.bound));
                                  }
                                } else if (codeList[4] == "007") {
                                  // 回水压力
                                  let m002p = this.delSpan(
                                    this.nameListStation[i]["m_002p"]
                                  );
                                  if (m002p !== "--") {
                                    this.nameListStation[i][
                                      "m_002p"
                                    ] = this.formatVal(m002p, String(v2.bound));
                                  }
                                }
                              }
                            }
                          });
                        });
                        bbb = this.nameListStation.map((v) => Object.values(v));
                        let ccc = [...aaa, ...bbb];
                        this.warnIdList = [];
                        ccc.forEach((c, i) => {
                          this.warnList.forEach((w) => {
                            if (c.pid == w.pid) {
                              if (w.code === "003-002-001-001-000-0131") {
                                this.warnIdList.push(i);
                              }
                            }
                          });
                        });
                        let ddd = [];
                        this.pids.forEach((p) => {
                          ccc.forEach((c) => {
                            if (p == c[0]) {
                              ddd.push(c.splice(1));
                            }
                          });
                        });
                        // let index = ddd.findIndex(item => (item[0].indexOf('二马路') > -1));
                        // let thobj = ddd.splice(index, 1)
                        // ddd.splice(ddd.length, 0, ...thobj);
                        this.datalist = ddd;
                      });
                  });
              });
          });
      });
    },
    formatVal(item, type) {
      // if (type) {
      //   if (type === "1") {
      //     return `<span class="high">${item}</span>`;
      //   } else if (type === "0") {
      //     return `<span class="low">${item}</span>`;
      //   }
      // } else {
        if (item === null || item === undefined || item == Infinity) {
          return `<span class="default_zzn">--</span>`;
        } else {
          return `<span class="default_zzn">${item}</span>`;
        }
      // }
    },
    // 取html字符串中的值
    delSpan(item) {
      if (item.indexOf("span") > -1) {
        return item.split("</span>")[0].split(">").pop();
      } else {
        return item;
      }
    },
  },
};
</script>
<style lang='scss'>
.tablewarnhigh {
  position: absolute;
  right: var(--imgr);
  top: var(--imgt);
  background-image: url("/configuration/2d/gaojinghigh.png");
  width: var(--imgw);

  background-size: 100% 100%;
  background-position: center;
  background-repeat: no-repeat;
  padding: var(--imgp);
}
.tablewarnlow {
  position: absolute;
  right: var(--imgr);
  top: var(--imgt);
  background-image: url("/configuration/2d/gaojinglow.png");
  width: var(--imgw);
  background-size: 100% 100%;
  background-position: center;
  background-repeat: no-repeat;
  padding: var(--imgp);
}
.high {
  color: #da5a28;
}
.low {
  color: #139cf6;
}
.default_zzn {
  color: #a0c8db;
}
</style>